(function() {
	'user strict';
	
	require(['jquery'], function(jquery) {
		
		function roleList(data) {
			var myKey = data.myKey, 
				myValue = data.myValue,
				i = 0, keyLen = myKey.length,
				j = 0, valueLen = 0,
				valueGroup = {},
				liHeader = "",
				liList = "",
				liDivider = "";
			
			for (; i < keyLen; i++) {
				valueGroup = myValue[myKey[i]];
				valueLen = valueGroup.length, j=0, liList="";
				liHeader = '<li class="dropdown-header" group-index="' + i + '">'
					+ '<span class="text">' + myKey[i] + '</span>'
					+ '</li>';
				
				for(; j<valueLen; j++ ) {
					liList += '<li li-index="' + valueGroup[j].id + '" group-index="' + i + '">'
							+ '<a href="#" class="opt">'
							+ '<span class="text">' + valueGroup[j].name + '</span>'
							+ '<span class="glyphicon glyphicon-ok check-mark"></span></a></li>';
				}
				liDivider = '<li class="divider" data-optgroup="2div"></li>';
				$('#role_user_ref').append(liHeader).append(liList).append(liDivider);
			}
		}
		
		$.ajax({
			url: "role/retrieveUserRoles.service",
			async: false,
			success: function(data) {
				if(data && data.success) {
					roleList(data);
				} else if(data && data.success == false) {
					alert(data.errorMsg);
				} else {
					alert("error");
				}
			}
		});
	});
})();